<template>
	<view class="itemdetail" v-if="info">
		<!-- <u-gap height="20" bg-color="#EEF2F3"></u-gap> -->
		<view class="header">
			<view class="top">
				<view class="left">
					<image :src="info.image" mode=""></image>
					{{info.name}}
				</view>
				<view class="right">
					会员免费
					<text>/¥{{info.price}}</text>
				</view>
			</view>
			<view class="bot">
				{{info.remark}}
			</view>
		</view>
		<view class="content">
			<view class="name">
				服务说明
			</view>
			<view class="info">
				<u-parse :html="info.content"></u-parse>
			</view>
		</view>
		<!-- vuex_srls_isvip  nfo.is_order -->

		<view v-if="vuex_srls_isvip==1 || info.is_order==1 " class="footer">
			<view class="btns">
				<view @click="wx(info,2)" class="item">
					<image src="/static/aidex/images/wx.png" mode=""></image>
					微信咨询
				</view>
				<view class="item" @click="tell(info,2)">
					<image src="/static/aidex/images/tel.png" mode=""></image>
					电话咨询
				</view>
			</view>
		</view>

		<view v-else class="footer">
			<view class="wrap">
				<view class="left">
					<view class="item1" @click="tell(info,1)">
						<image src="/static/aidex/images/d1.png" mode=""></image>
						<view class="text">
							电话沟通
						</view>
					</view>
					<view class="item1" @click="wx(info,1)">
						<image src="/static/aidex/images/d2.png" mode=""></image>
						<view class="text">
							微信沟通
						</view>
					</view>
				</view>
				<view class="item2">
					<u-button @click="buy(info)" class="btn" shape="circle" type="primary" :ripple="true"
						ripple-bg-color="#909399">立即购买</u-button>
				</view>
			</view>
		</view>


		<!-- 添加二维码 -->

		<u-popup close-icon-color="#999" :closeable="true" v-model="show" mode="center" border-radius="14">
			<view class="pop">

				<image show-menu-by-longpress="true" :src="info.platform_image" mode=""></image>
				<view class="tips">
					长按识别二维码添加客服
				</view>
			</view>
		</u-popup>


	</view>
</template>

<script>
	import {
		checkLogin,
		checkIsVip,
		checkLoginAndIsVip
	} from '../../../utils/checklogin.js'
	export default {
		data() {
			return {
				show: false,
				info: null,
				type: '',
				curid: ''
			}
		},
		methods: {
			buy(info) {

				if (!this.vuex_srls_token) {
					uni.navigateTo({
						url: "/pages/sys/login/index"
					})

				} else {
					this.pay({
						type: '3', //下单类型，1、会员购买；2、精选服务；3、专业咨询
						goods_id: info?.id,
					})
				}
			},

			pay(info) {
				let that = this;
				this.$u.api
					.Orderbuy(info)
					.then((resDate) => {
						uni.requestPayment({
							provider: 'wxpay',
							timeStamp: resDate?.timeStamp,
							nonceStr: resDate?.nonceStr,
							package: resDate?.package,
							signType: resDate?.signType,
							paySign: resDate?.paySign,
							success: function(res) {
								that.getdetail()
							},
							fail: function(err) {
								// that.info.is_order=1
								console.log('fail:' + JSON.stringify(err));
							}
						});

					});
			},
			tell(item, type) {


				if (!this.vuex_srls_token) {
					uni.navigateTo({
						url: "/pages/sys/login/index"
					})

				} else {

					if (type == 2) {
						uni.makePhoneCall({
							phoneNumber: item.platform_tel, // 电话号码
							success: function() {
								console.log('拨打电话成功！');
							},
							fail: function(err) {
								console.log('拨打电话失败：', err);
							}
						});
					} else {

						if (this.vuex_srls_isvip == 0 && this.info.is_order == 1) {
							uni.makePhoneCall({
								phoneNumber: item.platform_tel, // 电话号码
								success: function() {
									console.log('拨打电话成功！');
								},
								fail: function(err) {
									console.log('拨打电话失败：', err);
								}
							});
							return
						}
						if (this.vuex_srls_isvip == 1 && this.info.is_order == 0) {
							uni.makePhoneCall({
								phoneNumber: item.platform_tel, // 电话号码
								success: function() {
									console.log('拨打电话成功！');
								},
								fail: function(err) {
									console.log('拨打电话失败：', err);
								}
							});
							return
						}

						if (this.vuex_srls_isvip == 0) {
							uni.navigateTo({
								url: "/pages/sys/user/join?type=3&goods_id=" + this.info.id
							})
						}
					}

				}

			},
			wx(item, type) {



				if (!this.vuex_srls_token) {
					uni.navigateTo({
						url: "/pages/sys/login/index"
					})

				} else {

					if (type == 2) {
						this.show = true
					} else {
						if (this.vuex_srls_isvip == 0 && this.info.is_order == 1) {
							this.show = true
							return
						}
						if (this.vuex_srls_isvip == 1 && this.info.is_order == 0) {
							this.show = true
							return
						}

						if (this.vuex_srls_isvip == 0) {
							uni.navigateTo({
								url: "/pages/sys/user/join?type=3&goods_id=" + this.info.id
							})
						}
					}


				}
			},
			getdetail() {
				this.$u.api
					.zixunlshow({
						zixun_id: this.curid
					})
					.then((res) => {
						this.info = res?.data;
						console.log(res, 8888)
						// this.$u.vuex("vuex_srls_isvip", 0);
						// this.info.is_order=1
					});
			}

		},
		onLoad(e) {
			this.curid = e?.id;
			this.getdetail()
		}
	}
</script>

<style>
	page {
		background: #EEF2F3;
	}
</style>

<style scoped lang="scss">
	.btns {



		margin: 30rpx 24rpx;
		height: 92rpx;
		background: #00B9A7;
		border: 1px solid #00B9A7;
		border-radius: 52rpx;
		display: flex;
		align-items: center;
		overflow: hidden;

		.item {
			font-family: PingFangSC, PingFang SC;
			font-weight: 500;
			font-size: 36rpx;
			height: 96rpx;
			flex: 1;
			display: flex;
			align-items: center;
			justify-content: center;

			&:first-child {
				background: #FFFFFF;
				color: #00B9A7;
			}

			&:last-child {
				background: #00B9A7;
				color: #fff;
			}

			image {
				margin-right: 14rpx;
				width: 42rpx;
				height: 42rpx;
			}
		}
	}

	.pop {
		padding: 30rpx 50rpx;

		image {
			width: 500rpx;
			height: 500rpx;
			margin: 10rpx auto;
		}

		.tips {
			text-align: center;
			padding: 20rpx 0;
			color: #999;
		}
	}

	.footer {
		width: 100%;
		position: fixed;
		bottom: 0;
		height: 168rpx;
		background: #fff;
		z-index: 9;
		left: 0;
		right: 0;

		.wrap {
			padding: 43rpx 24rpx 0;
			display: flex;
			align-items: center;
			justify-content: space-between;
		}




		.left {
			display: flex;
			align-items: center;
			margin-right: 42rpx;

			&.active {
				width: 100%;
				justify-content: space-around;
			}
		}

		.item1 {
			width: 100rpx;

			&:first-child {
				margin-right: 86rpx;
			}

			image {
				display: block;
				width: 42rpx;
				height: 42rpx;
				margin-bottom: 2rpx;
				margin: 0 auto;
			}

			.text {
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 24rpx;
				color: #666666;
				line-height: 28rpx;
			}
		}

		.item2 {
			width: 399rpx;
		}

		.btns1 {

			width: 100%;
			height: 96rpx;
			background: #00B9A7;
			border-radius: 48rpx;
			font-family: PingFangSC, PingFang SC;
			font-weight: 600;
			font-size: 36rpx;
			color: #FFFFFF;

			.btn {
				width: 100%;
			}

			/deep/ .u-size-default {
				border-radius: 48rpx !important;
				height: 96rpx !important;
				line-height: 96rpx !important;
				font-family: PingFangSC, PingFang SC !important;
				font-weight: 600 !important;
				font-size: 36rpx !important;
			}
		}
	}

	.content {
		background: #FFFFFF;
		border-radius: 10rpx;
		margin: 24rpx 0;
		min-height: 80vh;
		padding: 24rpx 24rpx 200rpx;

		.name {
			font-family: PingFangSC, PingFang SC;
			font-weight: 500;
			font-size: 32rpx;
			color: #000000;
			line-height: 45rpx;
			margin-bottom: 15rpx;
		}

		.info {
			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			font-size: 28rpx;
			color: #000000;
			line-height: 33rpx;
		}
	}

	.itemdetail {
		margin: 24rpx;
	}

	.header {
		padding: 24rpx 24rpx 41rpx;
		background: #FFFFFF;
		border-radius: 10rpx;


		.top {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-bottom: 24rpx;

			.left {
				display: flex;
				align-items: center;
				flex: 1;
				font-family: PingFangSC, PingFang SC;
				font-weight: 500;
				font-size: 30rpx;
				color: #000000;
				line-height: 42rpx;

				image {
					width: 56rpx;
					height: 56rpx;
					margin-right: 15rpx;
				}
			}

			.right {
				display: flex;
				align-items: center;
				font-family: PingFangSC, PingFang SC;
				font-weight: 500;
				font-size: 28rpx;
				color: #FD3E2E;
				line-height: 40rpx;

				text {

					font-family: PingFangSC, PingFang SC;
					font-weight: 400;
					font-size: 28rpx;
					color: #6B6D72;
					margin-top: 5rpx;
				}
			}
		}

		.bot {
			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			font-size: 28rpx;
			color: #6B6D72;
			line-height: 33rpx;
		}
	}
</style>